<template>
    <Card dis-hover :bordered="false">
        <jg-Search :searchData="searchData" @on-change-change="askData"></jg-Search>
        <div class='ivu-mt-8'>
            <!-- <Table
                ref='table'
                highlight-row
                show-summary
                border
                :columns='columns'
                :loading='loading'
                :data='data'
                :summary-method="handleSummary"
            > -->
            <Table
                ref='table'
                highlight-row
                border
                :columns='columns'
                :loading='loading'
                :data='data'
            >
                <!-- <template slot="footer">
                    <Page
                        show-total
                        show-elevator
                        show-sizer
                        :total="total"
                        :current.sync="params.page"
                        :page-size="params.pageSize"
                        :page-size-opts="pageOpts"
                        @on-change="changepage"
                        @on-page-size-change="changepageSize"
                        style="text-align: center;"
                    />
                </template> -->
            </Table>
        </div>
    </Card>
</template>
<script>
import jgSearch from '@/components/search'
import {statisticsinformationreportindexreport} from "@api/hqapi/indexone";
export default {
    components: { jgSearch },
    data() {
        return {
            loading: false,
            // total: 0,
            pageOpts: [10, 15, 20, 30, 50], // 分页每页数量
            searchData: {
                project: [
                    {
                        id: 1,
                        key: "DatePicker",
                        style: { width: "200px" },
                        value: ["", ""],
                        type: "daterange",
                        options: {
                            disabledDate(date) {
                                return (
                                    date &&
                                    date.valueOf() > Date.now() - 3600 * 1000
                                );
                            },
                        },
                        callback: "change",
                        placeholder: "请选择时间",
                    },
                    {
                        id: 2,
                        key: "Select",
                        style: { width: "118px" },
                        value: "",
                        childList: [],
                        clearable: true,
                        type: "daterange",
                        callback: "change",
                        placeholder: "请选择部门",
                    },
                ],
            },
            data: [],
            params: { page: 1, pageSize: 10, department_id: '', start_time: '', end_time: '' }, // 请求参数
            columns: [
                {
                    title: "人员",
                    key: "realname",
                    minWidth: 130,
                },
                {
                    title: "完善率",
                    key: "rate",
                    render: (h, params) => {
                        return h(
                            "div",
                            {},
                            params.row.rate + "%"
                        );
                    },
                    minWidth: 130,
                },
                {
                    title: "待完善",
                    align: 'center',
                    children: [
                        // {
                        //     title: "微信",
                        //     key: "friend_cnt",
                        //     minWidth: 130,
                        // },
                    ]
                },
            ],
        };
    },
    mounted() {
        this.initial();
    },
    methods: {
        /* @函数功能: 初始化 */
        initial() {
            this.searchData.project[0].value = [this.$Date(`${this.$Date().format('YYYY-MM')}-1`),this.$Date()]
            this.askData();
        },
        /* @函数功能: 请求数据 */
        askData(){
            this.params.start_time = this.searchData.project[0].value[0]
            this.params.end_time = this.searchData.project[0].value[1]
            this.params.department_id = this.searchData.project[1].value
            this.loading = true
            statisticsinformationreportindexreport(this.params).then((res) => {
                if (+this.searchData.project[1].childList.length === 0) {
                    this.searchData.project[1].childList = res.department_list
                }
                this.columns[2].children = []
                for (let item of res.header_list) {
                    this.columns[2].children.push({
                        title: item.label,
                        key: item.value,
                        minWidth: 130,
                    })
                }
                this.logs(this.columns)
                this.data = res.list
                // this.total = res.total;
                this.loading = false
            });
        },
        /* @函数功能: 分页 */
        // changepage(e) {
        //     this.params.page = e;
        //     this.askData();
        // },
        /* @函数功能: 每页数量 */
        // changepageSize(e) {
        //     this.params.pageSize = e;
        //     this.askData();
        // },
        // handleSummary ({ columns, data }) {
        //     const sums = {};
        //     columns.forEach((column, index) => {
        //         const key = column.key;
        //         if (index === 0) {
        //             sums[key] = {
        //                 key,
        //                 value: '合计'
        //             };
        //             return;
        //         }
        //         const values = data.map(item => Number(item[key]));
        //         if (!values.every(value => isNaN(value))) {
        //             const v = values.reduce((prev, curr) => {
        //                 const value = Number(curr);
        //                 if (!isNaN(value)) {
        //                     return prev + curr;
        //                 } else {
        //                     return prev;
        //                 }
        //             }, 0);
        //             sums[key] = {
        //                 key,
        //                 value: v + ' 元'
        //             };
        //         } else {
        //             sums[key] = {
        //                 key,
        //                 value: 'N/A'
        //             };
        //         }
        //     });

        //     return sums;
        // }
    }
};
</script>
